<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@page pageEncoding="UTF-8" %>
<!doctype html>
<html lang="zh-cmn">
<head>
    <%@include file="/WEB-INF/page/comm/head.jsp"%>
</head>
<body>
    <div class="container">
        <h3 id="tit">用户管理</h3>
        <button class="btn btn-primary pull-right" type="button" onclick="add()">添加用户</button>
        <table class="table table-bordered border-striped">
            <tr>
                <th>用户编号</th>
                <th>名称</th>
                <th>生日</th>
                <th>电话</th>
                <th>地址</th>
                <th>操作</th>
            </tr>
            <c:forEach items="${list}" var="u">
                <tr>
                    <td>${u.userCode}</td>
                    <td>${u.userName}</td>
                    <fmt:formatDate value="${u.birthday}" pattern="yyyy-MM-dd" var="fd"/>
                    <td>${fd}</td>
                    <td>${u.phone}</td>
                    <td>${u.address}</td>
                    <!--<td><img src="${ctx}/static/attach/${u.cardPic}" style="width: 50px; height: 50px;"></td>-->
                    <td><a href="javascript:addCard()" class="btn btn-danger btn-sm">上传证件</a>
                        &nbsp;<a href="javascript:showInfo(${u.id})" class="btn btn-success btn-sm">详细信息</a>
                    </td>
                </tr>
            </c:forEach>
        </table>
    </div>

    <div id="detail">
        <p>
            <label>用户名:</label><span></span>
        </p>
        <p>
            <label>性别:</label><span></span>
        </p>
        <p>
            <label>电话:</label><span></span>
        </p>
        <p>
            <label>地址:</label><span></span>
        </p>
        <p>
            <label>出生日期:</label><span></span>
        </p>
    </div>
<%@include file="/WEB-INF/page/comm/foot.jsp"%>
<script>
    function addCard() {
        location=ctx+"user/card";
    }
    function showInfo(id) {
        $.get(ctx+"user/detail/"+id,function (u) {
            $("#detail").find("span:eq(0)").html(u.userName);
            $("#detail").find("span:eq(1)").html(u.gender==1?"男":"女");
            $("#detail").find("span:eq(2)").html(u.phone);
            $("#detail").find("span:eq(3)").html(u.address);
            $("#detail").find("span:eq(4)").html(u.birthday);
            $("#detail").dialog("open");
        },'json');
    }
    $(function () {
        $("#detail").dialog({title:"用户详细信息"});
    });
    function add(){
        location=ctx+"user/add";
    }
</script>
</body>
</html>